<template>
    <AModal
        v-model="visible"
        :title="showTitle"
        :width="width"
        :footer="null"
        :destroyOnClose="true"
        @cancel="handleCancel"
    >
        <VModelForm
            ref="formRef"
            :formData="formValue"
            :fields="fields"
            :isView="isLook"
        />
        <ARow v-if="!isLook" :gutter="[24, 24]" type="flex" :justify="justify">
            <AButton type="primary" :loading="loading" @click="submit">{{
                subText
            }}</AButton>
            <AButton style="margin-left: 10px" @click="handleCancel">{{
                cancelText
            }}</AButton>
        </ARow>
    </AModal>
</template>

<script>
import { cloneDeep } from "lodash-es";
import props from "./props";
export default {
    name: "VEditModelForm",
    mixins: [props],
    data() {
        return {
            visible: false,
            id: undefined,
            formValue: {},
            loading: false,
        };
    },
    computed: {
        showTitle() {
            return this.isLook ? this.lookTitle : this.id ? this.editTitle : this.addTitle
        }
    },
    methods: {
        show(id) {
            this.id = id;
            if (this.id) this.getFormDetail();
            this.visible = true;
        },
        async submit() {
            const value = await this.$refs.formRef.onSubmit();
            const data =
                this.handler && typeof this.handler === "function"
                    ? this.handler(cloneDeep(value))
                    : { ...value };
            if (this.id) {
                if (!this.httpEdit) return console.error("No_Http_Edit");
                this.loading = true;
                this.httpEdit(this.id, data).then(() => {
                    this.loading = false;
                    this.$message.success("编辑成功");
                    this.handleCancel();
                    // 抛出重载方法
                    this.$emit("reload");
                });
            } else {
                if (!this.httpAdd) return console.error("No_Http_Add");
                this.loading = true;
                this.httpAdd(data).then(() => {
                    this.loading = false;
                    this.$message.success("新增成功");
                    this.handleCancel();
                    // 抛出重载方法
                    this.$emit("reload");
                });
            }
        },
        getFormDetail() {
            if (this.httpGet) {
                this.httpGet(this.id).then((res) => {
                    const data =
                        this.getHandler && typeof this.getHandler === "function"
                            ? this.getHandler(res.data)
                            : res.data;
                    this.formValue = cloneDeep({ ...this.formValue, ...data });
                });
            } else {
                const value =
                    this.getHandler && typeof this.getHandler === "function"
                        ? this.getHandler(this.value)
                        : { ...this.value };
                this.formValue = cloneDeep({ ...this.formValue, ...value });
            }
        },
        handleCancel() {
            this.$refs.formRef?.resetForm();
            this.visible = false;
        },
    },
};
</script>

<style></style>
